<template>
  <div class="box">
    <h1>身高：{{ height | percentage }}</h1>
    <h1>体重：{{ weight | percentage }}</h1>
    <Item v-for="item in userNum" :key="item.id" :num="item.num" />
  </div>
</template>

<script>
  import Item from "./components/Item.vue";

  export default {
    name: "App",
    components: {
      Item,
    },
    data() {
      return {
        height: 187.245646,
        weight: 140.7657684,
        userNum: [
          { id: 1, num: "145679345678" },
          { id: 2, num: "564765684421678" },
          { id: 3, num: "13222567876889422" },
        ],
      };
    },
    /*
      局部注册过滤器的时候，使用filters配置项注册
      过滤器是一个函数，函数接收第一个参数就是当前被过滤的值，过滤器函数return的值就是最后过滤出来的值
    */
    // filters: {
    //   percentage(data) {
    //     return data.toFixed(2);
    //   },
    // },
    // filters: {
    //   percentage(data) {
    //     return data.toFixed(2);
    //   },
    // },
    filters: {
      percentage(data) {
        return data.toFixed(2);
      },
    },
  };
</script>

<style></style>
